<!-- 卡片 -->
<template>
<router-link :to="to" class="card-wp c-flex-column c-col-center c-row-center" :style="{height: height, background: background}">
  <div class="c-flex c-col-center c-row-center" :style="{height: imgHeight}">
    <slot></slot>
  </div>
  <div class="text" :style="{color: fontColor}">{{text}}</div>
</router-link>
</template>
<script>

export default {
  data () {
    return {

    }
  },
  props: {
    height: {
      default: '214px'
    },
    background: {
      default: '#fff'
    },
    imgHeight: {
      default: '80px'
    },
    fontColor: {
      default: '#fff'
    },
    text: {
      default: ''
    },
    // 要调转的路由
    to: {
      default: '/hosp/home'
    }
  },
  mounted () {

  },
  methods: {

  }
}
</script>
<style lang="scss" scoped>
.card-wp {
  height: 200px;
  border-radius: 15px;
  background: #fff;
  width: 100%;
  .text {
    margin-top: 20px;
    line-height: 35px;
    font-size: 28px;
  }
}
@media screen and (max-width: 1200px) {
  .card-wp {
    .text {
      font-size: 24px;
    }
  }
}
</style>